@import "../global/mixin.less";
.article-card {
  .margin-center(100%);
  max-width: 500px;
  height: 100%;
  border-radius: 10px;
  background: @bg8-green;
  position: relative;
  overflow: hidden;
  .article-head {
    .article-bg {
      position: relative;
      width: 100%;
      .article-banner {
        height: 220px;
        width: 100%;
        // 对图片进行裁切，保持比例
        object-fit: cover;
      }
      .article-title {
        position: absolute;
        left: 25px;
        line-height: 32px;
        bottom: 28px;
        color: #fff;
        font-size: 28px;
        padding-right: 10px;
        box-sizing: border-box;
        .ellipsis(2);
      }
    }
  }
  .article-content {
    padding: 5px 10px;
    margin-top: 10px;
    .article-summary {
      .ellipsis(3);
      line-height: 25px;
    }
  }
  .article-subline {
    padding: 16px 10px;
    display: flex;
    justify-content: space-between;
    .article-buildtime {
    }
    .article-category-wrapper {
      display: flex;
      .article-category {
        color: #000;
        .article-category-text {
        }
      }
    }
  }
  .article-tags-wrapper {
    border-top: 1px solid #ccc;
    display: flex;
    position: absolute;
    bottom: 0px;
    left: 0;
    padding: 6px 10px;
    width: 100%;
    height: 38px;
    .article-tag {
      .center();
      background: #1aad19;
      margin: 0 5px;
      padding: 4px 10px;
      border-radius: 10px;
      .article-tag-text {
        font-size: 15px;
        color: #fff;
      }
    }
  }
}
